{extend name="public/base"}

{block name="css"}
<link href="/static/plugins/jquery-treetable/css/jquery.treetable.css" rel="stylesheet">
<link href="/static/plugins/jquery-treetable/css/jquery.treetable.theme.default.css" rel="stylesheet">
{/block}

{block name="content"}
<div class="container-fluid">

    <div class="row">
        <div class="col-12">
            <div class="card-box">
                <div class="row">
                    <div class="col-sm-2 dept-border">
                        <div class="dept-title">
                            <h4>部门列表</h4>
                        </div>
                        <table class="tree-table tree-table-checkbox tree-left-menu">
                            <tbody>
                                {foreach $deptList as $item}
                                    <tr data-tt-id="{$item.id}" data-tt-parent-id="{$item.parent_id}">
                                        <td>
                                            <label><a href="{:url('SysUser/index',['dept_id' => $item.id])}">{$item.dept_name}</a></label>
                                        </td>
                                    </tr>
                                {/foreach}
                            </tbody>
                        </table>
                    </div>
                    <div class="col-sm-10"> 
                        <div class="search-box">
                            <div class="col-sm-2"> 
                                <a href="#add-edit-modal" class="btn btn-custom waves-effect waves-light btn-md" data-animation="fadein" data-plugin="custommodal"
                                               data-overlaySpeed="200" data-overlayColor="#36404a" data-width="900" id="add-btn">+ 添加</a>
                            </div>
                            <div class="col-sm-10">
                                <form action="{:url('SysUser/index')}" method="get" class="form-inline form-inline-right">
                                    <div class="form-group m-r-10">
                                        <input type="text" class="form-control" name="username" value="{:isset($params.username) ? $params.username : ''}" placeholder="登录账号">
                                    </div>
                                    <div class="form-group m-r-10">
                                        <input type="text" class="form-control" name="realname" value="{:isset($params.realname) ? $params.realname : ''}" placeholder="姓名">
                                    </div>
                                    <div class="form-group m-r-10">
                                        <input type="text" class="form-control" name="phone" value="{:isset($params.phone) ? $params.phone : ''}" placeholder="手机号">
                                    </div>
                                    <button type="submit" class="btn btn-custom waves-effect waves-light btn-md">
                                        查询
                                    </button>
                                    <a href="{:url('SysUser/index')}" class="btn btn-custom waves-effect waves-light btn-md clear-search">清空</a>
                                </form>
                            </div>
                        </div>

                        <div class="table-rep-plugin">
                            <div class="table-responsive" data-pattern="priority-columns">
                                <table id="tech-companies-1" class="table  table-striped">
                                    <thead>
                                    <tr>
                                        <th>用户ID</th>
                                        <th data-priority="3">姓名</th>
                                        <th data-priority="3">登录账号</th>
                                        <th data-priority="3">电话</th>
                                        <th data-priority="3">邮箱</th>
                                        <th data-priority="3">性别</th>
                                        <th data-priority="3">职位</th>
                                        <th data-priority="3">生日</th>
                                        <th data-priority="3">状态</th>
                                        <th data-priority="1">最后登录</th>
                                        <th data-priority="3">入职时间</th>
                                        <th data-priority="6">操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                        {foreach $list as $item}
                                            <tr>
                                                <td>{$item.id}</td>
                                                <td>{$item.realname}</td>
                                                <td>{$item.username}</td>
                                                <td>{$item.phone}</td>
                                                <td>{$item.email}</td>
                                                <td>{$item.sexName}</td>
                                                <td>{$item.post_name}</td>
                                                <td>{$item.birthday}</td>
                                                <td><span class="{$item.status==1 ? 'status-on' : 'status-off'}">{$item.statusName}</span></td>
                                                <td>{$item.login_date|substr=0,10}</td>
                                                <td>{$item.entry_date}</td>
                                                <td class="actions">
                                                    {if $item.user_type!=100}
                                                    <a href="#add-edit-modal" class="on-default edit-row edit-btn" data-animation="fadein" data-plugin="custommodal"
                                                    data-overlaySpeed="200" data-overlayColor="#36404a" data-width="900" data-url="{:url('SysUser/info',['id'=>$item.id])}">编辑</a>
                                                    <a href="javacript:;" class="on-default remove-row delete-btn" data-url="{:url('SysUser/delete',['ids'=>$item.id])}">删除</a>
                                                    {/if}
                                                </td>
                                            </tr>
                                        {/foreach}
                                    </tbody>
                                </table>
                                <div class="page-web">
                                    {$page|raw}
                                </div>
                                
                            </div>
        
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end row -->

    <!-- Modal --> 
    <div id="add-edit-modal" class="modal-demo">
        <button type="button" class="close" onclick="Custombox.close();">
            <span>&times;</span><span class="sr-only">Close</span>
        </button>
        <h4 class="custom-modal-title"></h4>
        <div class="custom-modal-text">
            <form class="add-edit-form" method="post">
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <div class="select-box">
                                <label for="deptId">所在部门<span class="text-danger">*</span></label>
                                <input type="hidden" name="dept_id" value="0">
                                <div class="select-div form-control"><span data-name="dept_name">请选择部门</span><i class="fa fa-angle-down"></i></div>
                                <table class="tree-table2 tree-table-checkbox select-table">
                                    <tbody class="select-option">
                                        {foreach $deptList as $item}
                                            <tr data-tt-id="{$item.id}" data-tt-parent-id="{$item.parent_id}">
                                                <td>
                                                    <label data-option="{$item.id}">{$item.dept_name}</label>
                                                </td>
                                            </tr>
                                        {/foreach}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="sex">岗位</label>
                            <select class="form-control" name="post_id">
                                <option value="0">请选择</option>
                                {foreach $postList as $item}
                                <option value="{$item.id}">{$item.post_name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="userName">用户名<span class="text-danger">*</span></label>
                            <input type="text" name="username" parsley-trigger="change" required
                                   placeholder="请输入用户名" class="form-control" id="userName">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="pass1">密码<span class="text-danger">*</span></label>
                            <input id="pass1" type="password" name="password" placeholder="请输入密码" required
                                   class="form-control">
                        </div>
        
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="realname">姓名<span class="text-danger">*</span></label>
                            <input type="text" name="realname" parsley-trigger="change" required
                                   placeholder="请输入姓名" class="form-control" id="realname">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="phone">手机号<span class="text-danger">*</span></label>
                            <input type="text" name="phone" parsley-trigger="change" required
                                   placeholder="请输入手机号" class="form-control" id="phone">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="email">邮箱</label>
                            <input type="email" name="email" parsley-trigger="change"
                                   placeholder="请输入邮箱" class="form-control" id="email">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="sex">性别</label>
                            <select class="form-control" name="sex">
                                <option value="-1">请选择</option>
                                {foreach $sexList as $sex}
                                <option value="{$sex.code}">{$sex.desc}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>入职时间</label>
                            <div>
                                <div class="input-group">
                                    <input type="text" class="form-control datepicker" name="entry_date" placeholder="年-月-日">
                                    <span class="input-group-addon bg-custom b-0"><i class="mdi mdi-calendar text-white"></i></span>
                                </div><!-- input-group -->
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>生日</label>
                            <div>
                                <div class="input-group">
                                    <input type="text" class="form-control datepicker" name="birthday" placeholder="年-月-日">
                                    <span class="input-group-addon bg-custom b-0"><i class="mdi mdi-calendar text-white"></i></span>
                                </div><!-- input-group -->
                            </div>
                        </div>
                    </div>
                </div>
            
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="status">状态</label>
                            <select class="form-control" name="status">
                                {foreach $statusList as $status}
                                <option value="{$status.code}">{$status.desc}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="is_leader">是否作为部门负责人</label>
                            <select class="form-control" name="is_leader">
                                <option value="0">否</option>
                                <option value="1">是</option>
                            </select>
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="roleIds">所属角色</label>
                    <div class="checkbox role-checkbox checkbox-primary clearfix">
                        {foreach $roleList as $item}
                        <div class="checkbox-item">
                            <input id="checkbox{$item.id}" type="checkbox" name="roleIds[]" value="{$item.id}">
                            <label for="checkbox{$item.id}">{$item.role_name}</label>
                        </div>
                        {/foreach}
                    </div>
                </div>

                <div class="form-group text-center m-b-0">
                    <input type="hidden" name="id" >
                    <button class="btn btn-custom waves-effect waves-light" type="submit">确定</button>
                </div>

            </form>
        </div>
    </div>

</div> <!-- container -->

{/block}

{block name="script"}
<script src="/static/plugins/jquery-treetable/jquery.treetable.js"></script>
<script>
    const addEditConfig = {
     'addUrl': "{:url('sysuser/add')}",
     'editUrl': "{:url('sysuser/edit')}"
    }
    const addData = {
     status: 1,
     sex: -1,
     post_id: 0,
     is_leader: 0,
     dept_name: "请选择部门"
    }

    $(".tree-table").treetable({
        expandable: true,
        initialState: "expanded"
    });
    $(".tree-table2").treetable({
        expandable: true,
        initialState: "collapsed"
    });

 </script>
{/block}
